﻿

var $ = layui.jquery;

$(document).ready(function () {


    layui.use(function () {
        var table = layui.table;
        var form = layui.form;
        var $ = layui.jquery;
        var util = layui.util;
        var token = localStorage.getItem("token");



        util.on('reloadEvent', function () {
            reloadTable()
        });



        //获取列表数据


        var Code = $("#Code").val() || '';
        var Name = $("#Name").val() || '';
        $.ajax({
            url: '/Foundation/GetEquipment', // 此处为静态模拟数据，实际使用时需换成真实接口
            type: 'GET',
            data: {
                Code: Code,
                Name: Name,
                pageIndex: 1,
                pageSize: 500,
                Token: token
            },
            success: function (res) {

                var resdata = JSON.parse(res);
                console.log(resdata);
                if (resdata != null) {

                    table.render({
                        elem: '#ID-EquipmentList',
                        data: resdata.data.list,
                        page: true,
                        height: '800px',
                        limit: 15,
                        limits: [15, 20, 30],
                        cols: [[
                            { type: 'checkbox', fixed: 'left' },
                            // 未自定义模板的普通列
                            { field: 'equipmentCode', width: 200, title: '设备编号', sort: true },
                            // 模板 - 选择器写法
                            { field: 'equipmentName', width: 200, title: '设备名称' },
                            {
                                field: 'isAuthorize', width: 200, title: '是否授权', templet: function (d) {
                                    if (d.isAuthorize == true) {
                                        return '<span>是</span>';
                                    } else {
                                        return '<span>否</span>';
                                    }
                                }

                            },
                            { field: 'authorIdentifier', width: 400, title: '授权标识符' },
                            // 模板 - 函数写法
                            {
                                field: 'equipmentState', width: 200, title: '状态', templet: function (d) {
                                    if (d.equipmentState == 1) {
                                        return '<span>使用中</span>';
                                    } else {
                                        return '<span>闲置</span>';
                                    }
                                }
                            },

                            // 模板中可包含任意字段、任意内容（如表单等）
                            { field: 'eremark', title: '备注', width: 300 },
                            {
                                title: '操作', width: 300, templet: function (d) {
                                    return ' <button class="layui-btn layui-btn-primary layui-btn-sm layui-border layui-icon layui-icon-edit"  lay-on="edit" onclick="Edit(' + d.equipmentId + ')">编辑</button> <button class="layui-btn layui-btn-primary layui-btn-sm layui-border layui-icon layui-icon-edit" onclick="Del(' + d.equipmentId + ')">删除</button>';
                                }
                            },

                        ]],
                        toolbar: '#toolbarDemo',
                        defaultToolbar: ['exports'],
                    });
                }
                else {
                    layer.msg('获取数据失败', { icon: 2 });
                }
            }

        });




        // 监听查询按钮点击事件
        $('#search').on('click', function () {
            reloadTable(); // 点击查询按钮时刷新表格
        });
        function reloadTable() {
            var Code = $("#Code").val() || '';
            var Name = $("#Name").val() || '';
            console.log(Code);
            console.log(Name);
            $.ajax({
                url: '/Foundation/GetEquipment', // 此处为静态模拟数据，实际使用时需换成真实接口
                type: 'GET',
                data: {
                    Code: Code,
                    Name: Name,
                    pageIndex: 1,
                    pageSize: 500,
                    Token: token
                },
                success: function (res) {

                    var resdata = JSON.parse(res);
                    console.log(resdata);
                    if (resdata != null) {

                        table.render({
                            elem: '#ID-EquipmentList',
                            data: resdata.data.list,
                            page: true,
                            height: '800px',
                            limit: 15,
                            limits: [15, 20, 30],
                            cols: [[
                                { type: 'checkbox', fixed: 'left' },
                                // 未自定义模板的普通列
                                { field: 'equipmentCode', width: 200, title: '设备编号', sort: true },
                                // 模板 - 选择器写法
                                { field: 'equipmentName', width: 200, title: '设备名称' },
                                {
                                    field: 'isAuthorize', width: 200, title: '是否授权', templet: function (d) {
                                        if (d.isAuthorize == true) {
                                            return '<span>是</span>';
                                        } else {
                                            return '<span>否</span>';
                                        }
                                    }

                                },
                                { field: 'authorIdentifier', width: 400, title: '授权标识符' },
                                // 模板 - 函数写法
                                {
                                    field: 'equipmentState', width: 200, title: '状态', templet: function (d) {
                                        if (d.equipmentState == 1) {
                                            return '<span>使用中</span>';
                                        } else {
                                            return '<span>闲置</span>';
                                        }
                                    }
                                },

                                // 模板中可包含任意字段、任意内容（如表单等）
                                { field: 'eremark', title: '备注', width: 300 },
                                {
                                    title: '操作', width: 300, templet: function (d) {
                                        return ' <button class="layui-btn layui-btn-primary layui-btn-sm layui-border layui-icon layui-icon-edit"  lay-on="edit" onclick="Edit(' + d.equipmentId + ')">编辑</button> <button class="layui-btn layui-btn-primary layui-btn-sm layui-border layui-icon layui-icon-edit" onclick="Del(' + d.equipmentId + ')">删除</button>';
                                    }
                                },

                            ]],
                            toolbar: '#toolbarDemo',
                            defaultToolbar: ['exports'],
                        });
                    }
                    else {
                        layer.msg('获取数据失败', { icon: 2 });
                    }
                }

            });
        }



        var ids = [];
        var check = [];
        //获取复选框数据
        table.on('checkbox(test)', function (obj) {
            //console.log(obj)
            // console.log(obj.type); // 得到触发事件的类型：all（代表全选）| one（代表单选）
            //console.log(obj.checked); // 得到checkbox选中状态：true（选中）| false（取消）\
            //console.log(obj.othis); // 得到原始dom对象
            console.log(obj.data); //得到当前行数据

            // 获取所有选中的值
            var checkeddata = obj.data; // 获取所有选中的行数据
            if (obj.checked) {
                ids.push(checkeddata.equipmentId);
                check.push(checkeddata);
            } else {
                var indextoremove = ids.indexof(checkeddata.equipmentId);
                if (indextoremove !== -1) {
                    ids.splice(indextoremove, 1);  // 从 ids 数组中移除
                    check.splice(indextoremove, 1); // 从 check 数组中移除
                }
            }

            console.log(ids); // 打印所有选中的id
            console.log(check); // 打印所有选中的id
        });


        ///批量删除
        $('#myDelete').click(function () {
            if (ids.length == 0) {
                layer.msg('至少选一项', { icon: 2 });
                return;
            }
            var data = {
                ids: ids,
                DelName: "卢芳",
                Token: token
            }
            layer.confirm('确定删除吗？', { icon: 3 }, function () {
                $.ajax({
                    url: '/Foundation/DelEquipment',
                    type: 'Put',
                    data: data,
                    success: function (res) {
                        var resdata = JSON.parse(res);
                        if (resdata.data > 0) {
                            layer.msg('删除成功', { icon: 1 }, function () {
                                location.reload();
                            });

                        } else {
                            layer.msg('删除失败', { icon: 1 });
                        }
                    }
                })
            }), function () {
                layer.msg('已取消', {
                    time: 5000, //5s后自动关闭
                    btn: ['确定'],
                });
            }

        })

        //单删
        window.Del = function (equipmentId) {

            var datas = {
                ids: equipmentId,
                DelName: "卢芳",
                Token: token
            }
            layer.confirm('确定删除吗？', { icon: 3 }, function () {
                $.ajax({
                    url: '/Foundation/DelEquipment', // 此处为静态模拟数据，实际使用时需换成真实接口
                    type: 'Put',
                    data: datas,
                    success: function (res) {
                        var resdata = JSON.parse(res);
                        console.log(resdata);
                        if (resdata.data > 0) {
                            layer.msg('删除成功', { icon: 1 }, function () {
                                location.reload();
                            });

                        } else {
                            layer.msg('删除失败', { icon: 1 });
                        }
                    }
                })
            }), function () {
                layer.msg('点击取消的回调');
            }
        }


        //修改
        var fillback = {};
        window.Edit = function (equipmentId) {
            var fill = {
                EquipmentId: equipmentId,
                Token: token
            }
            $.ajax({
                url: '/Foundation/GetEquipmentInfo',
                type: 'GET',
                data: fill,
                success: function (res) {
                    var resdata = JSON.parse(res);
                    console.log(resdata.data);
                    fillback = {
                        equipmentCode: resdata.data.equipmentCode,
                        equipmentName: resdata.data.equipmentName,
                        authorIdentifier: resdata.data.authorIdentifier,
                        isAuthorize: resdata.data.isAuthorize,
                        equipmentState: resdata.data.equipmentState,
                        eremark: resdata.data.eremark,
                        equipmentId: resdata.data.equipmentId,
                        storehouseId: resdata.data.storehouseId,
                    };
                    form.val('demo2', fillback)
                },
                error: function (err) {
                    console.log(err);
                }

            })
            // 页面层
            var index = layer.open({
                type: 1,
                title: '编辑设备',
                area: ['50%', '500px'], // 宽高
                content: '<form class="layui-form layui-row layui-col-space16" lay-filter="demo2">'
                    + '<div class="layui-form-item" style="margin-bottom: 0;">'
                    + '<label class="layui-form-label">设备编号</label>'
                    + ' <div class="layui-input-block">'
                    + ' <input disabled type="text" id="equipmentCode" name="equipmentCode" placeholder="请输入" style="width:200px" class="layui-input"></div> </div > '
                    + '<div class="layui-form-item" style="margin-bottom: 0;">'
                    + '<label class="layui-form-label">设备名称:</label>'
                    + '<div class="layui-input-block">'
                    + ' <input type="text" id="equipmentName" name="equipmentName" placeholder="请输入" style="width:200px" class="layui-input"></div> </div >'
                    + '<div class="layui-form-item" style="margin-bottom: 0;">'
                    + '<label class="layui-form-label">授权标识符</label>'
                    + ' <div class="layui-input-block">'
                    + ' <input type="text" name="authorIdentifier" id="authorIdentifier" placeholder="请输入" style="width:200px" class="layui-input"></div> </div > '
                    + '<div class="layui-form-item" style="margin-bottom: 0;">'
                    + '<label class="layui-form-label">是否授权:</label>'
                    + '<div class="layui-input-inline">'
                    + '<input type="checkbox" name="isAuthorize" value=true id="isAuthorize"></div></div>'
                    + '<div class="layui-form-item" style="margin-bottom: 0;">'
                    + '<label class="layui-form-label">状态</label>'
                    + ' <div class="layui-input-block">'
                    + ' <input type="radio" name="equipmentState" id="equipmentState" value=1 title="使用中"> <input type="radio" name="equipmentState" value=0 title="闲置"  id="equipmentState"></div> </div> '
                    + '<div class="layui-form-item" style="margin-bottom: 0;">'
                    + '<label class="layui-form-label">备注:</label>'
                    + '<div class="layui-input-block">'
                    + ' <input type="text" name="eremark" id="eremark" placeholder="请输入" style="width:200px" class="layui-input"></div> </div >'
                    + '<div class="layui-form-item" style="margin-bottom: 0;">'
                    + '<div class="layui-input-block">'
                    + '  <button type="button" class="layui-btn layui-bg-blue" id="uptBtn">提交</button></div> </div >'
                    + '</form>'

            })
            //修改方法
            $("#uptBtn").click(function () {

                var equipmentCode = $('#equipmentCode').val();
                var equipmentName = $('#equipmentName').val();
                var authorIdentifier = $('#authorIdentifier').val();
                var isAuthorize = $('#isAuthorize').val();
                var equipmentState = $('#equipmentState').val();
                var eremark = $('#eremark').val();
                var field = {
                    equipmentCode: equipmentCode,
                    equipmentName: equipmentName,
                    authorIdentifier: authorIdentifier,
                    isAuthorize: isAuthorize,
                    equipmentState: equipmentState,
                    eremark: eremark,
                    equipmentId: equipmentId,
                    Token: token
                };
                console.log(field);
                //return; // 阻止表单跳转。
                $.ajax({
                    url: '/Foundation/UptEquipment',
                    type: 'POST',
                    data: field,
                    success: function (res) {
                        var s = JSON.parse(res);
                        console.log(s);

                        if (s.data > 0) {
                            layer.msg('修改成功', { icon: 1 }, function () {
                                layer.close(index);
                                location.reload();
                            });

                        }
                        else {
                            layer.msg('修改失败', { icon: 1 });
                            return false; // 阻止表单跳转。
                        }
                    }
                })
            })

        }





        //弹出层
        util.on('lay-on', {

            //新增
            'add': function () {
                var form = layui.form;
                form.render();
               
                // 页面层
                layer.open({
                    type: 1,
                    title: '新增设备',
                    area: ['50%', '550px'], // 宽高
                    content: '<form class="layui-form layui-row layui-col-space16">'
                        + '<div class="layui-form-item" style="margin-bottom: 0;">'
                        + '<label class="layui-form-label">设备编号</label>'
                        + ' <div class="layui-input-block">'
                        + ' <input type="text" id="equipmentCode" name="equipmentCode" placeholder="请输入" style="width:200px" class="layui-input" disabled></div> </div > '
                        + '<div class="layui-form-item" style="margin-bottom: 0;">'
                        + '<label class="layui-form-label">设备名称:</label>'
                        + '<div class="layui-input-block">'
                        + ' <input type="text" name="equipmentName" placeholder="请输入" style="width:200px" class="layui-input"></div> </div >'
                        + '<div class="layui-form-item" style="margin-bottom: 0;">'
                        + '<label class="layui-form-label">授权标识符</label>'
                        + ' <div class="layui-input-block">'
                        + ' <input type="text" name="authorIdentifier" placeholder="请输入" style="width:200px" class="layui-input"></div> </div > '
                        + '<div class="layui-form-item" style="margin-bottom: 0;">'
                        + '<label class="layui-form-label">是否授权:</label>'
                        + '<div class="layui-input-inline">'
                        + '<input type="checkbox" name="isAuthorize" value=true id="isAuthorize"></div></div>'
                        + '<div class="layui-form-item" style="margin-bottom: 0;">'
                        + '<label class="layui-form-label">状态</label>'
                        + ' <div class="layui-input-block">'
                        + ' <input type="radio" name="equipmentState" id="equipmentState" value=1 title="使用中"> <input type="radio" name="equipmentState" value=0 title="闲置"  id="equipmentState"></div> </div> '
                        + '<div class="layui-form-item" style="margin-bottom: 0;">'
                        + '<label class="layui-form-label">备注:</label>'
                        + '<div class="layui-input-block">'
                        + ' <input type="text" name="eremark" placeholder="请输入" style="width:200px" class="layui-input"></div> </div >'
                        + '<div class="layui-form-item" style="margin-bottom: 0;">'
                        + '<div class="layui-input-block">'
                        + '  <button class="layui-btn layui-bg-blue" id="addBtn" lay-submit lay-filter="demo1">提交</button></div> </div >'
                        + '</form>'
                });
                form.render();
                var codes = Math.floor(Math.random() * 100000) + 1000000;
                $("#equipmentCode").val(codes);
                console.log(codes);
            },


        })

        //添加提交
        form.on('submit(demo1)', function (data) {
            var equipmentCode = data.field.equipmentCode;
            var equipmentName = data.field.equipmentName;
            var authorIdentifier = data.field.authorIdentifier;
            var isAuthorize = data.field.isAuthorize ? true : false;
            var equipmentState = data.field.equipmentState;
            var eremark = data.field.eremark;
            var field = {
                equipmentCode: equipmentCode,
                equipmentName: equipmentName,
                authorIdentifier: authorIdentifier,
                isAuthorize: isAuthorize,
                equipmentState: equipmentState,
                eremark: eremark,
                Token: token
            }
            console.log(field);
            // return false; // 阻止表单跳转。
            $.ajax({
                url: '/Foundation/AddEquipment',
                type: 'POST',
                data: field,
                success: function (res) {
                    var s = JSON.parse(res);
                    if (s.data > 0) {
                        layer.msg('添加成功', { icon: 1 }, function () {

                            location.reload();
                        });

                    } else {

                    }
                }
            })
            return false; // 阻止表单跳转。
        })


    })
})
